<template>
  <div class="page-container">
    <!--工具栏-->
    <div class="toolbar">
      <el-form :inline="true" :model="filters" :size="size" ref="filters" label-width="100px">
        <el-row class="search-input">
          <el-form-item prop="cashNo" label="申请编号：">
            <el-input type="text" v-model.trim="filters.cashNo" placeholder="申请编号" maxlength="80"
                      clearable></el-input>
          </el-form-item>
          <!-- <el-form-item prop="nickName" label="用户昵称：">
            <el-input type="text" v-model.trim="filters.nickName" placeholder="用户昵称" maxlength="80"
                      clearable></el-input>
          </el-form-item>
          <el-form-item prop="phone" label="手机号：">
            <el-input type="text" v-model.trim="filters.phone"
                      onKeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode)))"
                      placeholder="手机号" minlength="11" maxlength="11" clearable></el-input>
          </el-form-item> -->
        </el-row>
        <el-row class="t_r button20">
          <el-form-item>
            <kt-button icon="fa fa-search" :label="$t('action.search')" type="primary" @click="findPage(null)"/>
          </el-form-item>
          <el-form-item>
            <kt-button icon="fa fa-refresh" :label="$t('action.reset')" type="primary" @click="resetForm('filters')"/>
          </el-form-item>

        </el-row>
      </el-form>
    </div>

    <!--分销员列表-->
    <cy-table
      :height="350"
      :highlightCurrentRow="true"
      :content="pageResult"
      :totalSize="totalSize"
      :showDetailOperation="false"
      :columns="columns"
      :showSelection="false"
      :showBatchDelete="false"
      :showEditOperation="false"
      @findPage="findPage"
      :showCustomOperation="true"
      :showDeleteOperation="false"
      @handleCustom="handleReview"
      customLabel="审核"
      :showOperation="true"
      ref="CyTable"
    ></cy-table>
    <!--新增编辑界面-->
    <el-dialog title="审核页面" width="30%" :visible.sync="dialogVisible" :close-on-click-modal="false" @close="dataFormClose">
       <el-form :inline="true" :model="dataForm" :size="size" ref="dataForm" label-width="100px" :rules="dataFormRule">
        <el-row class="search-input">
          <el-form-item prop="status" label="审核状态：">
            <el-select type="text" v-model.trim="dataForm.status" placeholder="用户账号" maxlength="80" clearable>
              <el-option
              v-for="item in option"
              :key="item.id"
              :value="item.id"
              :label="item.value"
              />
            </el-select>
          </el-form-item>
          <el-form-item prop="failureReason" label="拒绝理由：" v-if="dataForm.status == 3">
            <el-input type="textarea" v-model.trim="dataForm.failureReason" maxlength="200" style="width:400px" show-word-limit></el-input>
          </el-form-item>
        </el-row>
        <el-row class="t_r button20" style="text-align:center">
          <el-form-item>
            <kt-button  label="确认" type="primary" @click="confirm()"/>
          </el-form-item>
          <el-form-item>
            <kt-button  label="取消" type="primary" @click="cancel()"/>
          </el-form-item>
        </el-row>
       </el-form>
    </el-dialog>

  </div>
</template>

<script>
  import KtButton from '@/views/Core/KtButton'
  import CyTable from "@/views/Core/ProductTable";
  import Qriously from 'v-qriously'
  import {validatePhone} from '@/utils/validate'
import { param } from '../../../utils';

  export default {
    components: {
      KtButton,
      CyTable,
      Qriously,
    },

    data() {
      return {
        size: 'mini',
        pageRequest1: {pageNum: 1, pageSize: 10},
        filters: {
          userAccount: '',
          nickName: '',
          phone: ''
        },
        dataForm:{
          status:null,
        },
        dataFormRule:{
          status: [{required: true, message: "请选择审核状态", trigger: "change"}],
          failureReason: [{required: true, message: "请输入拒绝理由", trigger: "blur"}],
        },
        option: [
          {id:2,value:'审核通过'},
          {id:3,value:'审核拒绝'}
        ],
        editDialogVisible: false,
        shareDialogVisible: false,
        columns: [
          {
            prop: 'cashNo', label: '申请编号', minWidth: 100,
            formatter: function (row, column, prop) {
              if (prop == '') return '-'
              else return prop
            }
          },
          {
            prop: 'cashSource', label: '申请来源', minWidth: 100,
            formatter: function (row, column, prop) {
              if (row.cashSource == 1){
                  return 'H5'
              } else if (row.cashSource == 2){
                  return 'PC'
              }else if (row.cashSource == 3){
                  return ' Android'
              } else if (row.cashSource == 4){
                  return 'IOS'
              } else if (row.cashSource == 5){
                return '后台'
              } else if (row.cashSource == 6){
                return '小程序'
              }

            }
          },
          {prop: 'cashType', label: '申请类型', minWidth: 100 ,
            formatter: function (row, column, prop) {
                if (row.cashType == 1){
                    return '提现'
                } else{
                    return '结算增加'
                }

              }},
          {prop: 'memberName', label: '申请人', minWidth: 80},
          {prop: 'cashAmount', label: '申请金额', minWidth: 80},
          {prop: 'status', label: '申请状态', minWidth: 80,
            formatter: function (row, column, prop) {
                if (row.status == 1){
                    return '待审核'
                } else if (row.status == 2){
                    return '审核成功'
                }  else if (row.status == 3){
                    return '审核拒绝'
                } else if (row.status == 4){
                    return '待打款'
                }  else if (row.status == 5){
                    return '打款中'
                }   else if (row.status == 6){
                    return '打款成功'
                }  else if (row.status == 7){
                    return '打款失败'
                }   else if (row.status == 8){
                    return '申请完成'
                }

              }},
          {prop: 'applyTime', label: '申请时间', minWidth: 120}
        ],
        pageRequest: {pageNum: 1, pageSize: 10},
        pageResult: [],
        totalSize: 0,
        dialogVisible: false,
        tableData: [],
        currentPage: 1,
        totalSize1:0
      }
    },

    methods: {
      // 获取分页数据
      findPage: function (data) {
        let this_ = this
        if (this_.filters == undefined || this_.filters == null) {
          this_.filters = {}
        }
        this_.filters.start = this.pageRequest.pageNum
        this_.filters.limit = this.pageRequest.pageSize
        this.utils.request.queryApplyListPage(this_.filters, function (res) {
          if (res.data.rows.length === 0) {
              res.data.rows = []
          } else {
            this_.pageResult = res.data.rows;
            this_.totalSize = Number(res.data.total);
          }
        })
      },
      confirm(){
        let this_=this;
        let param = Object.assign({},this.dataForm)
        this.$refs.dataForm.validate(valid => {
          if(valid){
            this.utils.request.reviewStatusByApply(param,function(res){
              if(res.code =='0000'){
                this_.$message({message:'操作成功',type:"success"})
                this_.dialogVisible=false
                this_.findPage()
              }else{
                this_.$message({message:'操作失败',type:"error"})
              }
            })
          }
        })
      },
      cancel(){
        this.dialogVisible = false
      },
      dataFormClose(){
        this.$refs.dataForm.resetFields();
      },
      handleReview: function (param) {
        this.dataForm.id= param.row.id;
        this.dialogVisible = true
      },
      // 重置
      resetForm(formName) {
        //需要校验的key
      let keys = ["cashNo", ];
      let boo = this.seachTableUtils.checkFromIsNull(this.filters, keys);
      if (!boo) {
        return;
      }
        if (this.$refs[formName] != undefined) {
          this.$refs[formName].resetFields()
          this.findPage(null)
        }
      },

      handleSizeChange: function () {
        this.pageRequest1.pageSize = pageSize;
        this.findProductPage();
      },
      handleCurrentChange: function () {
        this.pageRequest1.pageNum = pageNum;
        this.findProductPage(this.pageRequest1);
      }

    },

    mounted() {

    }
  }
</script>

<style scoped lang='scss'>
  .btn-left {
    margin-left: 45px;
  }
</style>
